<template>
    <div id="app">
        <div class="menu-wrapper">
            <the-menu></the-menu>
        </div>
        <div class="content-wrapper">
            <router-view></router-view>
        </div>
    </div>
</template>

<script type="text/ecmascript-6">
    import TheMenu from "@/components/server/TheMenu/TheMenu";

    export default {
        data() {
            return {
                wait: true
            }
        },
        methods: {
            toggleWait() {
                this.wait = !this.wait;
            }
        },
        components: {TheMenu}
    }
</script>

<style lang="stylus" rel="stylesheet/stylus">
    @import "../../assets/stylus/base.styl";
    html, body {
        height 100%
    }

    #app {
        .menu-wrapper {
            position fixed
            top 0
            left 0
            bottom 0
            width 250px
            background #545c64
        }

        .content-wrapper {
            position absolute
            top 0
            left 250px
            right 0
        }
    }
</style>
